<template>
  <div>
    <!--     搜索条件-->
    <SearchForm @search="getTableData" @reset="resetSearch" :isSearchDisabled="isSearchDisabled">
      <el-col :span="8" :xs="24" v-if="$permiss[325]">
        <el-form-item :label="$t('所属租户')" prop="tenantId">
          <el-select style="width: 100%" v-model="page.tenantId" @change="tenantChange" clearable>
            <el-option v-for="item in tenantList" :key="item.adminUserId" :label="item.adminName"
                       :value="item.adminUserId"></el-option>
          </el-select>
        </el-form-item>
      </el-col>
      <el-col :span="8" :xs="24">
        <el-form-item :label="$t('订单编号')" prop="recordId">
          <el-input v-model="page.recordId"></el-input>
        </el-form-item>
      </el-col>
      <el-col :span="8" :xs="24">
        <el-form-item :label="$t('用户姓名')" prop="userName">
          <el-input v-model="page.userName"></el-input>
        </el-form-item>
      </el-col>
      <el-col :span="8" :xs="24">
        <el-form-item :label="$t('手机号码')" prop="userPhone">
          <el-input v-model="page.userPhone"/>
        </el-form-item>
      </el-col>
      <el-col :span="8" :xs="24">
        <el-form-item :label="$t('催收状态')" prop="status">
          <el-select style="width: 100%" v-model="page.status" clearable>
            <el-option v-for="item in statusList" :key="item.value" :label="item.label"
                       :value="item.value"></el-option>
          </el-select>
        </el-form-item>
      </el-col>
      <el-col :span="8" :xs="24">
        <el-form-item :label="$t('用户状态')" prop="isRepeatedBorrowing">
          <el-select style="width: 100%" v-model="page.isRepeatedBorrowing" clearable>
            <el-option :label="$t('初借')" :value="0"></el-option>
            <el-option :label="$t('复借')" :value="1"></el-option>
          </el-select>
        </el-form-item>
      </el-col>
      <el-col :span="8" :xs="24">
        <el-form-item :label="$t('联系结果')" prop="lastContactResult">
          <el-select style="width: 100%" v-model="page.lastContactResult" clearable>
            <el-option v-for="item in contactList" :key="item.key" :label="item.value"
                       :value="item.key"></el-option>
          </el-select>
        </el-form-item>
      </el-col>
      <!--      <el-col :span="8" :xs="24">-->
      <!--        <el-form-item label-width="110px" :label="$t('订单客群状态')" prop="isOverdue">-->
      <!--          <el-select style="width: 100%" v-model="page.isOverdue" clearable>-->
      <!--            <el-option v-for="item in guestGroupStatus" :key="item.value" :label="item.label"-->
      <!--                       :value="item.value"></el-option>-->
      <!--          </el-select>-->
      <!--        </el-form-item>-->
      <!--      </el-col>-->
      <el-col :span="8" :xs="24">
        <el-form-item :label="$t('催收进度')" prop="rateType">
          <el-select style="width: 100%" v-model="page.rateType" clearable>
            <el-option :label="$t('进行中')" :value="1"></el-option>
            <el-option :label="$t('已完成')" :value="2"></el-option>
          </el-select>
        </el-form-item>
      </el-col>
      <el-col :span="8" :xs="24" v-if="$permiss[327]">
        <el-form-item :label="$t('客群名称')" prop="guestGroupId">
          <el-select style="width: 100%" v-model="page.guestGroupId" clearable @change="guestGroupChange">
            <el-option v-for="item in guestGroupList" :key="item.guestGroupId" :label="item.guestGroupName"
                       :value="item.guestGroupId"></el-option>
          </el-select>
        </el-form-item>
      </el-col>
      <el-col :span="8" :xs="24" v-show="$permiss[1146]">
        <el-form-item :label="$t('经理名称')">
          <el-select :placeholder="$t('请选择经理')" style="width: 100%"
                     v-model="page.managerId" @change="managerChange" clearable>
            <el-option v-for="item in managerList" :key="item.adminUserId" :label="item.adminName"
                       :value="item.adminUserId"></el-option>
          </el-select>
        </el-form-item>
      </el-col>
      <el-col :span="8" :xs="24" v-if="$permiss[328]">
        <el-form-item :label="$t('催收员')" prop="adminUserId">
          <el-select style="width: 100%" v-model="page.adminUserId" clearable filterable>
            <el-option v-for="item in collectionUser" :key="item.adminUserId" :label="item.adminName"
                       :value="item.adminUserId"></el-option>
          </el-select>
        </el-form-item>
      </el-col>
      <el-col :span="8" :xs="24" v-if="$permiss[326]">
        <el-form-item :label="$t('APP名称')" prop="productName">
          <el-select style="width: 100%" v-model="page.productName" clearable>
            <el-option v-for="item in productList" :key="item.productId" :label="item.appName"
                       :value="item.productName"></el-option>
          </el-select>
        </el-form-item>
      </el-col>
      <el-col :span="8" :xs="24">
        <el-form-item :label="$t('逾期天数')" prop="overdueDay">
          <el-col :span="24">
            <el-col :span="11">
              <el-input v-model="page.overdueDayStart" style="width: 100%;"></el-input>
            </el-col>
            <el-col :span="1" style="line-height: 32px">-</el-col>
            <el-col :span="11">
              <el-input v-model="page.overdueDayEnd" style="width: 100%;"></el-input>
            </el-col>
          </el-col>
        </el-form-item>
      </el-col>
      <el-col :span="8" :xs="24">
        <el-form-item :label="$t('AI电话意向')" label-width="100px">
          <el-select style="width: 100%" v-model="page.telephoneFeedback" clearable>
            <el-option v-for="item in voiceAIList" :key="item.value" :label="item.label"
                       :value="item.value"></el-option>
          </el-select>
        </el-form-item>
      </el-col>
      <el-col :span="12" :xs="24">
        <el-form-item :label="$t('应还时间')" prop="shouldTimeValue">
          <el-date-picker
              v-model="page.shouldTimeValue"
              style="width: 100%"
              type="daterange"
              unlink-panels
              range-separator="~"
              value-format="yyyy-MM-dd"
              :start-placeholder="$t('开始时间')"
              :end-placeholder="$t('结束时间')">
          </el-date-picker>
        </el-form-item>
      </el-col>
      <el-col :span="12" :xs="24">
        <el-form-item :label="$t('实还时间')">
          <el-date-picker
              v-model="page.actualRefundTimeValue"
              style="width: 100%"
              type="daterange"
              unlink-panels
              range-separator="~"
              value-format="yyyy-MM-dd"
              :start-placeholder="$t('开始时间')"
              :end-placeholder="$t('结束时间')">
          </el-date-picker>
        </el-form-item>
      </el-col>
      <el-col :span="12" :xs="24">
        <el-form-item :label="$t('联系时间')" prop="contactTimeValue">
          <el-date-picker
              v-model="page.contactTimeValue"
              style="width: 100%"
              unlink-panels
              type="daterange"
              range-separator="~"
              value-format="yyyy-MM-dd"
              :start-placeholder="$t('开始时间')"
              :end-placeholder="$t('结束时间')">
          </el-date-picker>
        </el-form-item>
      </el-col>
    </SearchForm>
    <el-card shadow="never" style="margin-top: 10px">
      <div style="margin-bottom: 10px;display: flex;justify-content: space-between">
        <div>
          <el-link v-show="$permiss[1055]" type="primary" :underline="false" style="font-size: 18px">{{ $t('催回总金额') }} :
            {{ totalCollectionAmount }}
          </el-link>
        </div>
        <div>
          <el-button type="primary" @click="transferOrder" v-show="$permiss[329]">{{ $t('调单') }}</el-button>
          <el-button
              v-show="$permiss[962]"
              type="info"
              @click="exportsExcel"
              :loading="exportsLoading"
          >{{ $t("导出") }}
          </el-button>
          <!--          <el-button type="primary" v-show="isMoxige" @click="PushBozhi()">{{ $t('推送博智') }}</el-button>-->
        </div>
      </div>
      <Table :page="page" row-key="id" :table-column="tableColumn" :table-data="tableData"
             :loading="loading"
             @handleSizeChange="handleSizeChange" @handleCurrentChange="handleCurrentChange" max-height="600px">
        <template slot="recordId" slot-scope="scope">
          <el-link v-if="$permiss[336]" :underline="false" type="primary" @click="goDeatails(scope.row)">{{
              scope.row.recordId
            }}
          </el-link>
          <span v-else>{{ scope.row.recordId }}</span>
        </template>

        <template slot="handle" slot-scope="{row}">
          <el-button type="text" @click="lookRecord(row)">{{ $t('备注') }}</el-button>
        </template>
      </Table>
    </el-card>

    <!--     备注记录-->
    <Dialog :visible.sync="recordVisible" :title="$t('催收记录')" width="60%" :footer="false">
      <el-form label-width="80px" :model="recordPage" ref="recordPage">
        <el-row :gutter="24">
          <el-col :span="16">
            <el-form-item :label="$t('操作时间')" prop="operationTimeValue">
              <el-date-picker
                  v-model="recordPage.operationTimeValue"
                  style="width: 100%"
                  type="daterange"
                  range-separator="~"
                  value-format="yyyy-MM-dd"
                  :start-placeholder="$t('开始时间')"
                  :end-placeholder="$t('结束时间')">
              </el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="8" :xs="24" style="text-align: right">
            <el-button type="primary" @click="getRecord">{{ $t('查询') }}</el-button>
            <el-button @click="resetRecordSearch">{{ $t('重置') }}</el-button>
          </el-col>
        </el-row>
      </el-form>
      <div style="text-align: right;margin: 10px 0">
        <el-button type="primary" v-show="$permiss[985]" @click="addRecord">{{ $t('新增') }}</el-button>
      </div>
      <Table :page="recordPage" :table-data="recordTableData" :table-column="recordTableColumn"
             @handleSizeChange="recordSizeChange" @handleCurrentChange="recordCurrentChange"></Table>
    </Dialog>
    <!--      新增催收记录-->
    <Dialog :visible.sync="visibleAddRecord" :title="$t('新增催收记录')"
            @confirm="addRecordSubmit()" @cancel="visibleAddRecord = false" :append-body="true"
            @close="clearRecordForm()"
    >
      <el-form ref="recordForm" :model="recordForm" label-width="120px">
        <el-form-item :label="$t('手机号')" prop="phone" :rules="[
                {required: true, message: this.$t('不能为空')}
          ]">
          <el-input v-model="recordForm.phone">
          </el-input>
        </el-form-item>
        <el-form-item :label="$t('与借款人关系')" prop="contactObject" :rules="[
                {required: true, message: this.$t('不能为空')}
          ]">
          <el-select style="width: 100%" v-model="recordForm.contactObject">
            <el-option v-for="item in relationList" :key="item.value" :label="item.label"
                       :value="item.value"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item :label="$t('结果')" prop="contactResult" :rules="[
                {required: true, message: this.$t('不能为空')}
          ]">
          <el-select style="width: 100%" v-model="recordForm.contactResult" @change="collectionChange">
            <el-option v-for="item in contactList" :key="item.key" :label="item.value"
                       :value="item.key"></el-option>
          </el-select>
          <div style="margin-top: 10px">
            <el-tag v-for="item in tagsList" :effect="item.key === recordForm.labelList ? 'dark' : 'plain'"
                    :key="item.key"
                    @click="collectionClick(item)" :label="item.key" style="margin: 0 10px 10px 0;cursor: pointer">
              {{ item.value }}
            </el-tag>
          </div>
        </el-form-item>
        <el-form-item :label="$t('承诺还款时间')" prop="admitTime" v-if="recordForm.isTime === 1" :rules="[
                {required: true, message: this.$t('请选择日期')}
          ]">
          <el-date-picker
              style="width: 100%"
              :pickerOptions="{
                  disabledDate(time) {
                 //  当日意向客户只能选当天时间 非当日禁用后面时间
                 return recordForm.labelList === 1 ? time.getTime() !==  new Date(new Date().toLocaleDateString()).getTime() : time.getTime() < Date.now()
                 },
                }"
              v-model="recordForm.admitTime"
              type="datetime"
              format="yyyy-MM-dd HH:mm:ss"
              :placeholder="$t('选择日期')"
              value-format="yyyy-MM-dd HH:mm:ss">
          </el-date-picker>
        </el-form-item>
        <el-form-item :label="$t('备注')" prop="remarks" :required="recordForm.isRequiredRemark === 1 ? true : false"
                      :rules="recordForm.isRequiredRemark=== 1 ? [{ required: true, message: $t(
          '不能为空'),trigger:'blur'}] : []">
          <el-input type="textarea" v-model="recordForm.remarks" :rows="4"/>
        </el-form-item>
      </el-form>
    </Dialog>
    <!--     调单组件-->
    <TransferOrder :transferVisible.sync="visible" :guestGroupList="guestGroupList"
                   @confirm="getTableData"
                   :productList="productList" :buttonId="329"></TransferOrder>
  </div>
</template>

<script>
import TransferOrder from "./compoents/transferOrder";
import {dateFormatSection, defaultTimeDate, reasonTagsList} from "@/utils/tools";
import {export_json_to_excel} from "@/utils/exportExcel";
import {
  fetchCollectionList,
  collectionTotalAmount,
  resultList,
  collectionExport,
  addCollectionResultRecord, guestGroupList, guestGroupBindList
} from '@/api/postLoan'
import {selectProduct, selectTenant} from '@/api/system'
import {encrypt} from "@/utils/encrypt";

export default {
  name: "allCollectionOrder",
  data() {
    const {collectionList} = reasonTagsList()
    return {
      page: {
        pageNum: 1,
        pageSize: 10,
        total: 0,
        isAgency: 2,
        isOverdue: 1,
        rateType: 1,
        shouldTimeValue: defaultTimeDate(2)
      },
      totalCollectionAmount: 0,
      tableData: [],
      tableColumn: [
        {label: this.$t('订单编号'), slot: 'recordId', prop: 'recordId', align: 'center', fixed: "left", minWidth: 200},
        {label: this.$t('客群名称'), prop: 'guestGroupName', align: 'center',},
        {label: this.$t('用户姓名'), prop: 'userName', align: 'center',},
        {label: this.$t('手机号码'), prop: 'userPhone', align: 'center',},
        {label: this.$t('结清次数'), prop: 'settleNumber', align: 'center',},
        {label: this.$t('应还时间'), prop: 'refundDate', align: 'center', width: 150},
        {label: this.$t('逾期天数'), prop: 'overdueDay', align: 'center',},
        {label: this.$t('合同金额'), prop: 'passAmount', align: 'center',},
        {label: this.$t('打款金额'), prop: 'paymentAmount', align: 'center',},
        {label: this.$t('应还金额'), prop: 'refundAmount', align: 'center',},
        {label: this.$t('逾期罚息金额'), prop: 'overdueAmount', align: 'center', width: 150},
        {label: this.$t('已还金额'), prop: 'actualPayAmount', align: 'center',},
        {label: this.$t('实还时间'), prop: 'actualRefundDate', align: 'center', width: 150},
        {label: this.$t('减免金额'), prop: 'remissionAmount', align: 'center',},
        {label: this.$t('优惠券抵扣金额'), prop: 'deductibleAmount', align: 'center', minWidth: 120},
        {label: this.$t('剩余应还金额'), prop: 'surplusRefundAmount', align: 'center', width: 150},
        {label: this.$t('催回总金额'), prop: 'collectionAmount', align: 'center', width: 150},
        {label: this.$t('催收状态'), prop: 'status', align: 'center',},
        {label: this.$t('AI电话意向'), prop: 'telephoneFeedback', align: 'center', width: 100},
        {label: this.$t('联系结果'), prop: 'lastContactResult', align: 'center', width: 150},
        {label: this.$t('催收员'), prop: 'adminUserName', align: 'center',},
        {label: this.$t('与借款人关系'), prop: 'contactObject', align: 'center', width: 150},
        {label: this.$t('联系时间'), prop: 'lastContactTime', align: 'center', width: 150},
        {label: this.$t('APP名称'), prop: 'appName', align: 'center',},
        {label: this.$t('所属租户'), prop: 'tenantName', align: 'center', isHide: !this.$permiss[325]},
        {label: this.$t('操作'), slot: 'handle', align: 'center', fixed: 'right', isHide: !this.$permiss[790]},
      ],
      loading: false,
      contactList: collectionList,
      tagsList: [],
      statusList: [
        {label: this.$t('待处理'), value: 0},
        {label: this.$t('已处理'), value: 1},
        {label: this.$t('部分还款'), value: 2},
        {label: this.$t('已结清'), value: 3},
      ],
      guestGroupStatus: [
        {label: this.$t('未过期'), value: 1},
        {label: this.$t('已过期'), value: 2},
      ],
      voiceAIList: [
        {label: this.$t('愿意还款'), value: 'A'},
        {label: this.$t('需要跟进'), value: 'E'},
        {label: this.$t('需要帮助'), value: 'H'},
      ],
      relationList: [
        {label: this.$t('本人'), value: 1},
        {label: this.$t('配偶'), value: 8},
        {label: this.$t('父亲'), value: 2},
        {label: this.$t('母亲'), value: 3},
        {label: this.$t('兄弟'), value: 4},
        {label: this.$t('姐妹'), value: 5},
        {label: this.$t('同事'), value: 6},
        {label: this.$t('朋友'), value: 7},
      ],
      productList: [],
      tenantList: [],
      guestGroupList: [],
      auditPersonnelList: [],
      collectionUser: [],
      tableRows: {},
      visible: false,
      recordVisible: false,
      recordPage: {
        pageNum: 1,
        pageSize: 10,
        total: 0,
      },
      recordTableData: [],
      recordTableColumn: [
        {label: this.$t('操作时间'), prop: 'createTime', align: 'center', minWidth: 150},
        {label: this.$t('操作人'), prop: 'adminUserName', align: 'center', minWidth: 100},
        {label: this.$t('手机号'), prop: 'phones', align: 'center', minWidth: 100},
        {label: 'zalo', prop: 'zalo', align: 'center', minWidth: 100},
        {label: 'whatsApp', prop: 'whatsApp', align: 'center', minWidth: 100},
        {label: this.$t('与借款人关系'), prop: 'contactObject', align: 'center', minWidth: 150},
        {label: this.$t('结果'), prop: 'contactResult', align: 'center', minWidth: 150},
        {label: this.$t('承诺还款时间'), prop: 'admitTime', align: 'center', minWidth: 150},
        {label: this.$t('备注'), prop: 'remarks', align: 'center', minWidth: 150},
      ],
      visibleAddRecord: false,
      visibleMessage: false,
      recordForm: {},
      exportsLoading: false,
      isSearchDisabled: false,
      managerList: []
    }
  },
  mounted() {
    this.getTableData()
    // 获取客群名称
    guestGroupList({
      pageNum: 1,
      pageSize: 1000,
      type: 1
    }).then(res => {
      const {list} = res.data
      this.guestGroupList = list || []
    })
    // 租户
    selectTenant().then(res => {
      this.tenantList = res.data
    })
    // 产品列表
    selectProduct().then(res => {
      this.productList = res.data
    })
    //  催收员
    guestGroupBindList({
      pageSize: 100,
      adminRole: 7,
    }).then(res => {
      this.collectionUser = res.data.list
    })
    this.getManagerList()
  },

  methods: {
    async getTableData() {
      this.loading = true
      this.isSearchDisabled = true
      const [lastContactTimeStart, lastContactTimeEnd] = dateFormatSection(this.page.contactTimeValue || [])
      const [refundDateStart, refundDateEnd] = dateFormatSection(this.page.shouldTimeValue || [])
      const [actualRefundDateStart, actualRefundDateEnd] = dateFormatSection(this.page.actualRefundTimeValue || [])
      const params = {
        ...this.page,
        lastContactTimeStart, lastContactTimeEnd,
        refundDateStart, refundDateEnd,
        actualRefundDateStart, actualRefundDateEnd
      }
      delete params.contactTimeValue
      delete params.shouldTimeValue
      delete params.actualRefundTimeValue
      this.getAmountTotal(params)
      const res = await fetchCollectionList(params)
      if (res.code === 1) {
        const {list, total,} = res.data
        this.tableData = list.map(item => {
          const {collectionList, collectionTagsList} = reasonTagsList()
          const contactResult = collectionList.filter(v => item.lastContactResult === v.key)
          const tagsValue = collectionTagsList.filter(v => item.labelList === v.key)
          const contactObject = this.relationList.filter(i => i.value === item.contactObject)
          const telephoneFeedback = this.voiceAIList.find(i => i.value === item.telephoneFeedback)
          item.lastContactResult = contactResult.length && tagsValue.length ? contactResult[0].value + ' - ' + tagsValue[0].value : contactResult.length && tagsValue.length === 0 ? contactResult[0].value : ""
          // item.isOverdue = this.guestGroupStatus.filter(v => item.isOverdue === v.value)[0].label
          item.status = this.statusList.filter(v => item.status === v.value)[0].label
          item.contactObject = contactObject.length ? contactObject[0].label : ''
          item.telephoneFeedback = telephoneFeedback ? telephoneFeedback.label : ''
          return item
        })
        this.page = {
          ...this.page,
          total: total
        }
        this.isSearchDisabled = false
        this.loading = false
      } else {
        this.loading = false
        this.isSearchDisabled = false
      }
    },
    async getAmountTotal(params) {
      if (this.$permiss[1055]) {
        const res = await collectionTotalAmount(params)
        if (res.code === 1) {
          this.totalCollectionAmount = res.data
        }
      }
    },
    resetSearch() {
      this.page = {
        pageNum: 1,
        pageSize: 10,
        total: 0,
        isAgency: 2,
        isOverdue: 1
      }
      this.getTableData()
    },

    handleSizeChange(val) {
      this.page.pageSize = val
      this.getTableData()
    },
    handleCurrentChange(val) {
      this.page.pageNum = val
      this.getTableData()
    },
    /**
     *  客群下拉事件
     */
    async guestGroupChange(value) {
      if (this.page.adminUserId) this.page.adminUserId = null
      if (this.page.managerId) this.page.managerId = null
      this.getManagerList({guestGroupId: value})
      this.collectionUser = await guestGroupBindList({
        guestGroupId: value,
        adminRole: 7,
        pageSize: 100
      }).then(res => res.data.list)
    },
    transferOrder() {
      this.visible = true
    },
    /**
     * 获取经理
     * adminRole 6催收
     */
    getManagerList(params) {
      guestGroupBindList({
        ...params,
        adminRole: 6,
        pageSize: 100
      }).then(res => {
        if (res.code === 1) {
          this.managerList = this.uniqueTwo(res.data.list)
        }
      })
    },
    tenantChange(value) {
      selectProduct({adminUserId: value}).then(res => {
        this.productList = res.data
        this.$set(this.page, 'productName', null)
      })
      // 获取客群名称
      guestGroupList({
        pageNum: 1,
        pageSize: 1000,
        type: 1,
        adminUserId: value
      }).then(res => {
        const {list} = res.data
        this.guestGroupList = list || []
        this.$set(this.page, 'guestGroupId', null)
      })
    },
    // 去除重复人员
    uniqueTwo(arr) {
      let obj = {}
      let res = []
      arr.forEach(item => {
        if (!obj[item.adminUserId]) {
          res.push(item)
          obj[item.adminUserId] = true
        }
      })
      obj = {}
      return res
    },
    /**
     *  经理下拉事件
     */
    async managerChange(value) {
      if (this.page.adminUserId) this.page.adminUserId = null
      this.collectionUser = await guestGroupBindList({
        managerId: value,
        pageSize: 100,
        adminRole: 7,
      }).then(res => res.data.list)
    },
    // 查看备注详情
    lookRecord(row) {
      this.tableRows = {...row}
      this.recordVisible = true
      this.getRecord()
    },
    resetRecordSearch() {
      this.recordPage = {
        pageNum: 1,
        pageSize: 10,
        total: 0,
      }
      this.getRecord()
    },
    recordSizeChange(val) {
      this.recordPage.pageSize = val
      this.getRecord()
    },
    recordCurrentChange(val) {
      this.recordPage.pageNum = val
      this.getRecord()
    },
    // 获取备注记录
    async getRecord() {
      const [createDateStart, createDateEnd] = dateFormatSection(this.recordPage.operationTimeValue || [])
      const params = {
        loanRecordId: this.tableRows.recordId,
        collectionId: this.tableRows.collectionId,
        createDateStart,
        createDateEnd,
        ...this.recordPage
      }
      delete params.operationTimeValue
      const res = await resultList(params)
      if (res.code === 1) {
        const {list, pageSize, total, pageNum} = res.data
        this.recordTableData = list.map(item => {
          const {collectionList, collectionTagsList} = reasonTagsList()
          item.phones = item.contactMode === 0 ? item.phone : ''
          item.zalo = item.contactMode === 1 ? item.phone : ''
          item.whatsApp = item.contactMode === 2 ? item.phone : ''
          const contactResult = collectionList.filter(v => item.contactResult === v.key)
          const tagsValue = collectionTagsList.filter(v => item.labelList === v.key)
          const contactObject = this.relationList.filter(i => i.value === item.contactObject)
          item.contactResult = contactResult.length && tagsValue.length ? contactResult[0].value + ' - ' + tagsValue[0].value : contactResult.length && tagsValue.length === 0 ? contactResult[0].value : ""
          item.contactObject = contactObject.length ? contactObject[0].label : ''
          return item
        })
        this.recordPage = {
          ...this.recordPage,
          pageNum: pageNum,
          pageSize: pageSize,
          total: total,
        }
      }
    },
    goDeatails(row) {
      const query = {
        userStubId: row.userStubId,
        userId: row.userId,
        approvalId: row.approvalId,
        orderId: row.recordId,
        permissId: 336,
        collectionId: row.collectionId,
      }
      this.$router.push({
        path: '/order/orderDetails',
        query: {
          params: encrypt(query)
        }
      })
    },
    async exportsExcel() {
      this.exportsLoading = true;
      const [lastContactTimeStart, lastContactTimeEnd] = dateFormatSection(this.page.contactTimeValue || [])
      const [refundDateStart, refundDateEnd] = dateFormatSection(this.page.shouldTimeValue || [])
      const params = {
        ...this.page,
        lastContactTimeStart, lastContactTimeEnd,
        refundDateStart, refundDateEnd
      };
      delete params.contactTimeValue;
      delete params.shouldTimeValue;
      const res = await collectionExport(params);
      if (res.code === 1) {
        const headerData = [...this.tableColumn].filter(item => {
          const result = res.data.filter(i => {
            //过滤没有权限的字段
            return typeof i[item.prop] !== "undefined"
          })
          return result.length !== 0
        })
        const column = headerData.map(item => item.label)
        const filterVal = headerData.map(item => item.prop)
        const list = [...res.data].map(item => {
          const {collectionList, collectionTagsList} = reasonTagsList()
          const contactResult = collectionList.filter(v => item.lastContactResult === v.key)
          const tagsValue = collectionTagsList.filter(v => item.labelList === v.key)
          const contactObject = this.relationList.filter(i => i.value === item.contactObject)
          item.lastContactResult = contactResult.length && tagsValue.length ? contactResult[0].value + ' - ' + tagsValue[0].value : contactResult.length && tagsValue.length === 0 ? contactResult[0].value : ""
          // item.isOverdue = this.guestGroupStatus.filter(v => item.isOverdue === v.value)[0].label
          item.status = this.statusList.filter(v => item.status === v.value)[0].label
          item.contactObject = contactObject.length ? contactObject[0].label : ''
          return item
        }).map((v) => filterVal.map((j) => v[j]));
        const fileName = this.$t("全部催收订单");
        export_json_to_excel({
          header: column,
          data: list,
          filename: fileName,
        });
        this.exportsLoading = false;
      } else {
        this.exportsLoading = false;
      }
    },
    // 催收结果下拉
    collectionChange(value) {
      const {collectionTagsList, collectionList} = reasonTagsList()
      const selectList = collectionTagsList.filter(item => item.pid === value)
      this.tagsList = selectList
      // 默认第一位
      if (selectList.length !== 0) {
        const {key, isTime, isRemarks} = selectList[0]
        this.recordForm = {
          ...this.recordForm,
          labelList: key,
          isTime: isTime,
          isRequiredRemark: isRemarks
        }
      } else {
        const selectList = collectionList.filter(item => item.key === value)
        this.recordForm = {
          ...this.recordForm,
          labelList: null,
          isRequiredRemark: selectList[0].isRemarks
        }
      }
    },
    // 新增提醒记录
    addRecord() {
      this.visibleAddRecord = true
    },
    // 清空提醒记录
    clearRecordForm() {
      this.recordForm = {}
      this.tagsList = []
      this.$refs.recordForm.resetFields()
    },
    addRecordSubmit() {
      this.$refs.recordForm.validate(async v => {
        if (v) {
          const res = await addCollectionResultRecord({
            loanRecordId: this.tableRows.recordId,
            collectionId: this.tableRows.collectionId,
            ...this.recordForm
          })
          if (res.code === 1) {
            this.visibleAddRecord = false
            this.$message.success(this.$t('新增成功'))
            this.getRecord()
            this.getTableData()
          }
        }
      })
    },
    collectionClick({key, isTime, isRemarks}) {
      this.recordForm = {
        ...this.recordForm,
        labelList: key,
        isTime: isTime,
        isRequiredRemark: isRemarks
      }
    },
  },
  computed: {
    isMoxige() {
      return process.env.VUE_APP_REGION === 'moxige'
    }
  },
  components: {
    TransferOrder
  }
}
</script>

<style scoped>

</style>
